<template>
    <div>

        <div class="title-warpper">
            <div class="title">相关推荐</div>
            <div class="icon"></div>
        </div>
        <div class="list">
            <router-link tag="div" :to="'/mediaReport/article/' + item" class="item" v-for="item in [1,2,3,4,5,6]" :key="item">
                <div class="item-title">云家政大数据升级 打造中国家庭生活服务入口</div>
                <div class="item-time">时间    12-04</div>
            </router-link>
        </div>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="stylus" scoped>
    .title-warpper
        margin-top 64px
        height: 70px
        display flex
        align-items flex-end
        .title
            width 140px
            height 70px
            line-height 70px
            position relative
            text-align center
            font-size 26px
            letter-spacing 5px
            &:after,
            &:before
                content ''
                position absolute
                width 138px
                height 9px
                background-color #d2d2d2
                left 0
                right 0
                margin auto;
            &:before
                bottom 0
            &:after
                top 0
        .icon
            flex 1
            height 2px
            background-color #d2d2d2
    .list
        margin-top 50px
        background-color #f1efef
        padding 0 30px
        border-radius 10px
        .item
            height 55px
            display flex
            align-items center
            justify-content space-between
            border-bottom 1px solid #bfbfbf
            font-size 20px
            cursor pointer
            &:last-child
                border-bottom unset
            .item-title
                width 550px
                overflow hidden
                text-overflow ellipsis
                white-space nowrap
                color #383838
                &:hover
                    color #6ba0f7
            .item-time
                color #a1a2a4
</style>

